<template>
  <div>
    <!-- 关于我们 2018/2/14 21:09 zhangQ -->
    <Row>
      <i-col :span="24">
        <Carousel v-model="CarouselValue" style="position: relative;z-index: 100;position: relative;margin-top: -60px;"
                  :autoplay="setting.autoplay"
                  :autoplay-speed="setting.autoplaySpeed"
                  :dots="setting.dots"
                  :radius-dot="setting.radiusDot"
                  :trigger="setting.trigger"
                  :arrow="setting.arrow" >
          <CarouselItem>
            <img src="../../../../static/img/img_aboutus.png" width="100%"/>
          </CarouselItem>
        </Carousel>

      </i-col>
    </Row>
    <!-- content -->
    <div style="height: 100%; background: #fff;margin-top: 50px; margin-bottom: 50px;">
      <div style="width: 790px; margin:0 auto; background: #fff;">
        <div class="content">
          <div class="content_title">
            <h5>我们是谁？</h5>
          </div>
          <div class="content_main">
            <p>
              新疆新铁运联网络科技有限公司位于乌鲁木齐市经济开发区喀纳斯湖北路455号新疆软件园创智大厦A座11层，由乌鲁木齐铁路局集团有限公司与北京信和汇科科技有限公司、新疆九洲恒昌供应链管理股份有限公司于2017年共同出资成立。新铁运联致力于成就国内最好的多式联运企业信息服务平台，其运营的由铁路方参与发起的“联运e达”多式联运企业信息平台通过联运商情、智慧场站、智慧全程、S-ETC不停车抄单系统、EDI数据交换中心等企业级服务产品，实现了多式联运上下游企业间的信息互联与资源共享。以多式联运操作信息为纽带，以平台服务为依托，以降低企业间交易成本，提高联运组织效率为己任，不懈努力，积极进取。
            </p>
          </div>

          <div class="content_title" style="margin-top: 30px;">
            <h5>企业愿景</h5>
          </div>
          <div class="content_main">
            <p>
              成就国内最好的多式联运企业信息服务平台。
            </p>
          </div>

          <div class="content_title" style="margin-top: 30px;">
            <h5>企业使命 </h5>
          </div>
          <div class="content_main">
            <p>
              以多式联运操作信息为纽带，企业信息服务平台为依托，践行资源融合，促进多联企业间互惠发展，聚焦降低企业间交易成本，提高联运组织和操作效率，不懈努力，积极进取。
            </p>
          </div>

          <div class="content_title" style="margin-top: 30px;">
            <h5>经营模式</h5>
          </div>
          <div class="content_main">
            <p>
              通过互联网平台融合多式联运上下游企业车、货、箱、场、运踪、服务等信息资源，为多式联运企业间业务衔接、资源共享提供专业化的信息服务。
            </p>
          </div>
          <div class="content_main">
            <img :src="imgAboutus"/>
          </div>

          <div class="content_main">
            <h3>意见反馈</h3>
          </div>
          <div class="content_main">
            <Form :model="suggestForm" ref="suggestForm" :rules="suggestFormRules" label-position="top"
                  @submit.native.prevent>
              <FormItem label="选择反馈类型" prop="type">
                <RadioGroup v-model="suggestForm.type">
                  <Radio label="1">
                    <span>网站建议</span>
                  </Radio>
                  <Radio label="2">
                    <span>平台建议</span>
                  </Radio>
                  <Radio label="3">
                    <span>其他</span>
                  </Radio>
                </RadioGroup>
              </FormItem>
              <FormItem label="" prop="content">
                <Input v-model="suggestForm.content" type="textarea" :autosize="{minRows: 2, maxRows: 5}"></Input>
              </FormItem>
              <FormItem label="联系方式" prop="contactWay">
                <Input type="text" placeholder="请输入您的联系方式" v-model="suggestForm.contactWay"></Input>
              </FormItem>
              <FormItem>
                <Button type="primary" @click="submitSuggest">提交建议</Button>
              </FormItem>
            </Form>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import { sendSuggestion } from '@api/frontEnd'
  import imgAboutus from '../../../../static/img/img_aboutus01.jpg'
  import moment from 'moment'

  export default {
    name: 'index',
    data () {
      let CarouselValue = 0
      let setting = {
        autoplay: false,
        autoplaySpeed: 5000,
        dots: 'none',
        radiusDot: false,
        trigger: 'hover',
        arrow: 'never'
      }
      let suggestForm = {
        type: '1',
        content: '',
        contactWay: ''
      }
      let suggestFormRules = {
        content: [
          { required: true, message: '内容不能为空！', trigger: 'blur', whitespace: true, type: 'string' }
        ]
      }
      let datas = { CarouselValue, setting, imgAboutus, suggestForm, suggestFormRules }
      return datas
    },
    methods: {
      submitSuggest () {
        console.log(sendSuggestion, 'momentmoment', moment)
        sendSuggestion(this.suggestForm).then(res => {
          if (res.data.isSuccess === 1) {
            this.$Notice.success({
              title: '感谢您的建议',
              desc: '我们会尽快与您取得联系！请持续关注联运e达哦^_^',
              duration: 2
            })
            this.suggestForm.type = '1'
            this.suggestForm.content = ''
            this.suggestForm.contactWay = ''
          }
        })
      }
    }
  }
</script>

<style scoped="scoped">
  .h5, h5 {
    font-size: 1.25rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
  }

  .footers > div {
    /*float: left;*/
    font-size: 14px;
  }

  .footers > div > p {
    font-size: 18px;
    color: #FDFDFD;
    border-left: 1px solid #1B364D;
    padding-left: 15px;
  }

  .footers > .foo4 > p {
    font-size: 14px;
    color: #CACACA;
    margin-top: 3px;
  }

  .footers > .foo4 > img {
    display: inline-block;
    width: 96px;
    height: 88px;
    border-left: 1px solid #1B364D;
    padding-left: 15px;
    padding-top: 8px;
  }

  .footers > .foo4 > p:first-of-type {
    font-size: 18px;
    color: #FDFDFD;
  }

  .footers > div > p > a {
    text-decoration: none;
    font-size: 14px;
    color: #CACACA;
  }

  #mianDeng > p:first-of-type {
    margin-top: 30px;
    font-size: 22px;
    color: #1B1E21;
  }

  #mianDeng > p:last-of-type {
    width: 120px;
    height: 40px;
    margin: 0 auto;
    margin-top: 30px;
    background-color: #1B1E21;
    line-height: 40px;
  }

  #mianDeng a {
    text-decoration: none;
    color: #FECA2E;
    font-size: 16px;
  }

  .content {
    margin-top: 40px;
    background: #fff;
  }

  .content_main {
    margin-top: 40px;
    font-size: 16px;
  }

  p {
    line-height: 30px;
  }

</style>
<style>
  .ivu-layout {
    background-color: #fff;
  }
</style>
